/*This is css file for ------ module CV / template index ------ */

body {
    background: #ef882d;
/*  Declaration blow is deep version*/
    background-image: url("/images/image1.jpeg"), url("/images/image2.jpeg");

/*  Light version
    background-image: url("/images/image1_light.jpeg"), url("/images/image2_light.jpeg");*/
    background-repeat: repeat-x, repeat;
    
/*  Declaration blow is Chinese verstion*/
    font-family: "微软雅黑"; 
/*    font-family: Tahoma;*/

}
h5 strong {
    font-family: "幼圆"; 
}
.page-header {
    border: none; box-shadow:0 0 0;
    width: 1300px;
    height: 240px;
    margin: 0px auto;
    padding: 20px;


}
.page-header #profil {
    border-bottom : dashed 2px #f4262e;
    float:left;
    position: relative;
    top: 10px;
    left: 10px;
    width: 160px;
    height:230px;
    padding: 10px; 
    margin-right: 10px;
}
.page-header #profil:before {
    content: "ME ";  
    padding: 4px;
    background: #dedede;
    opacity: .3;
    border-radius:170px;
    border:solid 10px rgb(0,0,0);
    position: absolute; left: -30px; top: 91%;
}

.page-header #profil #avatar {
    margin-bottom: 15px;
}
.page-header #quality {
    height: 485px; width: 1020px;
    border: solid 1px blue;
    float: left;
    position: relative;
    z-index: 999;
    padding: 30px; padding-top: 22px;
    border: 2px solid #ccc;
    opacity: .9;
    background-color: #ddd;                     
    background-image: -webkit-linear-gradient(rgba(255,255,255,.5), rgba(255,255,255,0));
    background-image: -moz-linear-gradient(rgba(255,255,255,.5), rgba(255,255,255,0));
    background-image: -ms-linear-gradient(rgba(255,255,255,.5), rgba(255,255,255,0));
    background-image: -o-linear-gradient(rgba(255,255,255,.5), rgb(255,255,255));
    background-image: linear-gradient(rgba(255,255,255,.5), rgba(255,255,255,0));  
    -moz-border-radius: 4px;
    border-radius: 4px;  
    -moz-box-shadow: 0 1px 2px rgba(0,0,0,.4), 0 1px 0 rgba(255,255,255,.5) inset;
    -webkit-box-shadow: 0 1px 2px rgba(0,0,0,.4), 0 1px 0 rgba(255,255,255,.5) inset;
    box-shadow: 0 1px 2px rgba(0,0,0,.4), 0 1px 0 rgba(255,255,255,.5) inset;  
    text-shadow: 0 1px 0 rgba(255,255,255,.4); 

}

.page-header #quality:before
{
    content: "";
    position: absolute;
    z-index: 99999;
    left: -7px;   
    margin-left: -12px;  
    border-right: 20px solid #ECECEC;
    border-top: 20px solid transparent;
    border-bottom: 20px solid transparent;        
    border-left: 0;  
}

.page-header #quality blockquote {
    background: url("/images/ico_quote.png") 2px 4%  no-repeat;
}

.page-header #quality blockquote p,.page-header #quality blockquote small{
    padding-left: 18px;
    font-family: "方正准元";
    letter-spacing: .1em;
}
.page-header #quality blockquote p{
    font-size: 1.2em; font-style: italic; padding-bottom: 5px;
}

#timeline{
    background:url("/images/timeline.gif") top center repeat-y;
    width:820px;
    padding:50px 0;
    margin:40px auto 30px auto;
    overflow:hidden;
    list-style:none;
    position:relative;
}
#timeline:before, /* The dot */
#timeline:after{ /* The arrow */
    content:" ";
    width:10px;
    height:10px;
    display:block;
    background:#f43059;
    position:absolute;
    top:0;
    left:50%;
    margin-left:-5px;

    -moz-border-radius:20px;
    -webkit-border-radius:20px;
    border-radius:20px;
}
#timeline:after{
    margin-left:-7px;
    background:none;
    border:7px solid #f43059;
    border-color:#f43059 transparent transparent transparent;
    width:0;
    height:0;
    top:auto;
    bottom:-7px;

    -moz-border-radius:0;
    -webkit-border-radius:0;
    border-radius:0;
}
#timeline li:before,
#timeline li:after{
    content:" ";
    width:70px;
    height:1px;
    background:#f43059;
    position:absolute;
    left:100%;
    top:50%;
    background:-moz-linear-gradient(0,#d8d566,#f43059);
    background:-webkit-gradient(linear,left top,right top,from(#d8d566),to(#f43059));
}
#timeline li:nth-of-type(even){
    float:right;
    text-align:left;
}
#timeline li:nth-of-type(even):after{ /* Move branches */
    background:-moz-linear-gradient(0,#f43059,#d8d566);
    background:-webkit-gradient(linear,left top,right top,from(#f43059),to(#d8d566));
    left:auto;
    right:100%;
}
#timeline li:nth-of-type(odd),
#timeline li:nth-of-type(even){
    margin:-21px 0 0 0;
}
#timeline li{
    position:relative;
    clear:both;
    float:left;
    width:318px;
    padding:10px;
    background:#fef8c4;
    border:1px solid #d8d566;
    text-align:right;
    margin:0 0 10px 0;

    -moz-border-radius:2px;
    -webkit-border-radius:2px;
    border-radius:2px;
    -moz-box-shadow:0 1px #fff inset;
    -webkit-box-shadow:0 1px #fff inset;
    box-shadow:0 1px #fff inset;
}

#timeline .transparent {
    visibility: hidden;
}

footer {
    height: 50px;
    border-top: none;
}
footer a{
    width: 200px;
    float: right;
    position: relative; right: 70px;
    color:#2d2623; text-decoration: none;
    text-align: center;
    padding: 8px;
    border-bottom: 4px solid #f4262e;
}
footer a:after{
    content:'';
    width:0;
    height:0;
    position:absolute;
    left:50%;
    margin-left:-5px; /* value should match border-width below */
    bottom: 0;
    border-width:5px; /* value should match margin-left above */
    border-style:solid;
    border-color: transparent transparent purple transparent; /* create up arrow */
}
/*Here is the typography*/


code { line-height: 1.8em}

.page-header #quality .container .row blockquote {
    margin-top: 20px;
}

.page-header #quality .container .row  blockquote p {
    font-style: italic;
}
.page-header #profil #perso_info  span {
    font-family: 'Istok Web', sans-serif;
    font-size: 1.4em; line-height: 2.02em; color: #741417;
}
.page-header #profil #perso_info  p {
    font-size: 0.9em;  line-height: 1.02em; font-style: italic;
}
.page-header #profil #perso_info  p:nth-child(3){
    background: url("/images/ico_heart.png") 3% -22% no-repeat; padding-left: 15px;
}
#timeline li time {
    font-family: 'Vladimir Script';
    font-size: 1.7em; color: #f41b39; font-weight: 600; line-height: 1.3em; padding-right: 10px;
}
#timeline li time span {
    font-family: '微软雅黑'; font-style: italic; font-size: .7em; 
}
#timeline li time .date {
    font-family: 'Vladimir Script'; font-size: 1.6em; 
}
#timeline li  p {
    font-style: italic; line-height: 1.4em; font-size: 0.9em; margin-bottom: 4px;
}
#timeline li  .p_special {
    font-family: "方正准元简体";  font-style: italic; color:#2d2623; font-size: 1em; line-height: 1.4em;
}

